<template>
<div>
    <el-button-group style="vertical-align: middle;">
      <el-button :size="btnSize" @click="forumHome">
          {{btnName}}
      </el-button>
      <el-button :size="btnSize">
          <span  @click="linkTo">{{$t('main.kb')}}</span>
          <span style="margin-left: 20px;" @click="linkTo2"> {{$t('main.helpcenter')}}</span>
      </el-button>
      <el-button :size="btnSize" @click="$router.push({ name: 'mspbots-client-desired-index' })">
         {{$t('main.newFeature')}}
      </el-button>
     
    </el-button-group>
</div>
</template>

<script>
export default {
  name: 'Forum',
  data () {
    return {
      btnSize: 'mini',
      btnName: 'Forum',
      forumUrl: [{ appurl: '/home', forumurl: 'https://forum.mspbots.ai/' }]
    }
  },

  methods: {
    linkTo () {
      window.open('https://wiki.mspbots.ai/', '_blank')
    },
    linkTo2 () {
      window.open('https://jira.mspbots.ai/servicedesk/customer/portals', '_blank')
    },
    forumHome () {
      var pageName = this._.toLower(window.location.href.replace(window.location.origin, ''))
      var forumUrl = this.forumUrl
      for (let index = 0; index < forumUrl.length; index++) {
        var element = forumUrl[index]
        if (this._.toLower(element.appurl) === pageName) {
          window.open(element.forumurl, '_blank')
          return
        }
      }
      window.open('https://forum.mspbots.ai/', '_blank')
    }

  }
}
</script>
<style scoped>

</style>
